<template>
	<view style="width: 100%;height: 100%;">
		<!-- 头部 -->
		<view class="theme-container" style="position: relative;">
			<view :style="{ height: sConf.tH + 'px' }"></view>
			<view style="max-height: 100px;display: flex;flex-wrap: wrap;gap: 15px;padding: 10px;">
				<text v-for="(text, index) in hotKey" :key="index" style="padding: 5px 10px;color: #888;"
					@click="searchChange(text)">{{ text }}</text>
			</view>
		</view>

		<scroll-view class="mainContent" scroll-y="true" style="height: 80vh;">
			<view style="display: flex;flex-direction: column;gap: 5px;">

				<view v-for="(product, index) in goodsList" :key="index" @click="eventNavProduct(product.id)"
					style="display: flex;gap: 10px;padding: 5px 10px;">
					<tn-avatar :url="sConf.pics + (product.face || '/media/default/cover.png')" shape="square"
						size="lg" />
					<view style="display: flex;flex-direction: column;gap: 5px;">
						<text>{{ product.jingle.title }}</text>
						<text style="color: #888;font-size: small;">{{ product.jingle.jingle }}</text>
					</view>
				</view>

				<view v-for="(place, index) in placeList" :key="index" @click="eventNavPlace(place.id)"
					style="display: flex;gap: 10px;padding: 5px 10px;">
					<tn-avatar :url="sConf.pics + (place.logo || '/media/default/default.png')" shape="square"
						size="lg" />
					<view style="display: flex;flex-direction: column;gap: 5px;">
						<text>{{ place.nicename }}</text>
						<text style="color: #888;font-size: small;">{{ place.basename }}</text>
					</view>
				</view>

				<view v-for="(staff, index) in staffList" :key="index" @click="eventNavStaff(staff.id)"
					style="display: flex;gap: 10px;padding: 5px 10px;">
					<tn-avatar :url="sConf.pics + (staff.face || '/media/default/default_0.png')" shape="square"
						size="lg" />
					<view style="display: flex;flex-direction: column;gap: 5px;">
						<text>{{ staff.nicename }}</text>
						<text style="color: #888;font-size: small;">{{ staff.desc }}</text>
					</view>
				</view>

				<view v-if="goodsList.length === 0 && placeList.length === 0 && staffList.length === 0"
					style="padding: 20px;">
					<tn-empty mode="search"></tn-empty>
				</view>
				<view style="height: 120px;"> </view>
			</view>
		</scroll-view>
		<!-- 顶部自定义导航 -->
		<tn-navbar :placeholder="true" fixed bg-color="#FFFFFF00" text-color="#fff">
			<tn-search-box v-model="curSearch" placeholder="请输入搜索内容" shape="round" :border="false"
				:search-button="false" size="sm" @search="searchChange"
				style="background-color: #f1f1f1;width: 100%;border-radius: 10px;margin: 0 5px;" />
		</tn-navbar>

	</view>
</template>

<script>
import utils from '@/common/utils';
export default {
	data() {
		return {
			title: ' • 搜索',
			sConf: getApp().globalData,
			curSearch: null,
			hotKey: [], // 热门关键词
			goodsList: [], // 产品结果
			placeList: [], // 商户结果
			staffList: [] // 用户结果
		}
	},
	onLoad(args) {
		let key = String(args.search) || null;
		console.log('onLoad', key);
		if (key) {
			this.searchChange(key)
		}
		this.loadDefDate()
	},
	methods: {
		eventNavProduct(e) {
			uni.navigateTo({
				url: '/pagec/product/product?gid=' + e
			})
		},
		eventNavPlace(e) {
			uni.navigateTo({
				url: '/pageb/shoped/shoped?pid=' + e
			})
		},
		eventNavStaff(e) {
			let uc = encodeURIComponent('parent=' + e)
			uni.navigateTo({
				url: '/pageb/staff/staff?scene=' + uc
			})
		},
		async loadDefDate() {
			let host = this.sConf.host + '/api/hasHotKey/'
			await utils.allinpayMethodPost(host, {}).then(res => {
				console.log('热门关键词', res);
				this.hotKey = res.resmsg
			})
		},
		async searchChange(e) {
			console.log('搜索栏', e);
			let token = this.sConf.token || ''
			await utils.authenticatorOnList(this.sConf.host + '/weapps/product/', token, {
				status: 1,
				is_list: 1,
				is_card: 0,
				search: e
			}).then(res => {
				console.log('搜索产品', res);
				this.goodsList = res
			})
			await utils.authenticatorOnList(this.sConf.host + '/weapps/placeList/', token, {
				status: 1,
				search: e
			}).then(res => {
				console.log('搜索商户', res);
				this.placeList = res
			})
			await utils.authenticatorOnList(this.sConf.host + '/weapps/userinfo/', token, {
				status: 1,
				search: e
			}).then(res => {
				console.log('搜索用户', res);
				this.staffList = res
			})
		},
	}
}
</script>

<style lang="scss" scoped></style>